<template>
    <view class="order-item">
		<img :src="'http://images.zmzpl.com/'+item.img" alt="">
		<view class="info">
			<view class="name" v-if="item.goodsName">{{item.goodsName}}</view>
			<view class="name" v-if="item.name">{{item.name}}</view>
			<view class="sku-info"> {{item.skuName?item.skuName:'默认'}}</view>
			<view class="other">{{remark?remark:'好品质,好生活'}}</view>
			<view class="amounts">
				<view class="price" v-if="item.nowPrice">¥{{item.nowPrice}}</view>
				<view class="price" v-if="item.price">¥{{item.price}}</view>
				<view class="quantity">x {{item.quantity}}</view>
			</view>
		</view>

	</view>

</template>

<script>
    export default {
        created(){

        },
        props:{
          item:Object
        },
        computed:{
            remark(){
                let remark = ''
                if(this.item.point&&this.item.point>0){
                    remark += this.item.point+'积分换购 '
                }
                if(this.item.coupon&&this.item.coupon>0){
                    remark += '可使用'+this.item.coupon+'优惠券'
                }
                return remark
            }
        },
        data(){
            return {
                // imgH:process.env.VUE_APP_IMG_DOMAIN
            }
        }
    }
</script>

<style scoped lang="stylus">
    .order-item
        margin-top 20rpx
        padding 0 10rpx
        display flex
        align-items center
        img
            width 180rpx
            height 180rpx
            flex 0 0 180rpx
            border-radius 5px
        .info
            padding 12rpx 126rpx 12rpx 30rpx
            font-size 0
            position relative
            overflow hidden
            width 100%
            .name
                white-space nowrap
                text-overflow ellipsis
                overflow hidden
                color #4E3D07
                font-size 24rpx
                margin-bottom 24px
                line-height 24px
            .sku-info
                width fit-content
                color #A1A1A1
                font-size 22rpx
                padding 14rpx 16rpx
                background-color #FBFAFA
                line-height 22rpx
                margin-bottom 28rpx
                font-weight 300
            .other
                width fit-content
                background-color #FBDFD4
                font-size 20rpx
                font-weight 300
                color #F7895E
                padding 4rpx 8rpx
            .amounts
                text-align right
                font-size 0
                position absolute
                right 0
                top 12rpx
                .price
                    color #4E3D07
                    font-size 24rpx
                    line-height 50rpx
                    font-weight 300
                .quantity
                    color $font-color-light
                    font-size 24rpx
                    font-weight 300
                    margin-top 14rpx

</style>